<template>
  <div>
    <b-carousel
            id="carousel-1"
            :interval="4000"
            controls
            indicators
            background="#ababab"
            img-width="1024"
            img-height="480"
            style="text-shadow: 1px 1px 2px #333;"
    >
<!--      <b-carousel-slide caption="First slide" :img-src="img1"></b-carousel-slide>-->
      <b-carousel-slide img-src="http://127.0.0.1/public/1.jpg"></b-carousel-slide>
      <b-carousel-slide img-src="http://127.0.0.1/public/2.jpg"></b-carousel-slide>
      <b-carousel-slide img-src="http://127.0.0.1/public/3.jpg"></b-carousel-slide>
      <b-carousel-slide img-src="http://127.0.0.1/public/4.jpg"></b-carousel-slide>
    </b-carousel>

  </div>
</template>

<script>

  export default {
    data() {
      return {
        img1:'@/assets/img/52.jpg'
      }
    }
  }
</script>


<style scoped>

</style>
